<template>
  <ListPage ref="refListPage">
    <template #header>
      <van-nav-bar :fixed="false" title="待办">
        <template #right>
          <van-icon name="search" size="18" @click="refRefreshList.popupSearch"/>
        </template>
      </van-nav-bar>
    </template>
    <RefreshList ref="refRefreshList" :config="listConfig">
      <template #default="{record}">
        <ListItem @click="() => toDetail(record)">
          <ListItemRow>
            <template #left>{{ record.realname }}</template>
            <template #right>
              <FlowStatusTag>
                审核中
              </FlowStatusTag>
            </template>
          </ListItemRow>
          <ListItemRow>
            <template #left>创建日期</template>
            <template #right>
              {{ record.createTime }}
            </template>
          </ListItemRow>
          <ListItemRow>
            基本信息的说明基本信息的说明基本信息的说明基本信息的说明基本信息的说明
          </ListItemRow>
        </ListItem>
      </template>
    </RefreshList>
  </ListPage>
</template>
<script setup>
import ListPage from '@hhd/page/ListPage.vue';
import {refreshListConfig} from '@/utils';
import RefreshList from '@hhd/plat/RefreshList';
import {getAction} from '@req';
import ListItem from '@hhd/plat/RefreshList/ListItem.vue';
import ListItemRow from '@hhd/plat/RefreshList/ListItemRow.vue';
import {shallowRef} from 'vue';
import {useRouter} from 'vue-router';

const refListPage = shallowRef();
const refRefreshList = shallowRef({});
const listConfig = refreshListConfig({
  queryParams: {
    column: 'createTime',
    order: 'desc'
  },
  loadPage(params, loaded) {
    console.log('加载数据了!');
    getAction('/sys/user/list', params).then(res => {
      loaded(res.result);
    }).catch(e => {
      console.log(e);
    });
  }
});

const router = useRouter();
function toDetail(recod) {
  router.push({name: 'testDetailPage', refresh: true, query: {
      id: '123',
    }});
}

defineOptions({
  name: 'TodoPage'
});
</script>